<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
            <title>Cindy JS</title>
            <script type="text/javascript" src="../build/js/Cindy.js"></script>
            <link rel="stylesheet" href="../css/cindy.css">


            </head>

	<body style="font-family:Arial;">

        <h1>CindyJS: Angle Bisector</h1>
        <script id='init' type='text/x-cindyscript'>
         dir=E-D;
          dir=dir/|dir|*1.5;

        </script>


        <script id='csmove' type='text/x-cindyscript'>

        fillcircle((0,0),100,color->(0,0,.4));

        if(mover()==E,
          dir=E-D;
          dir=dir/|dir|*1.5;
        );
        E.xy=D+dir;

        m1=A.xy;
r1=6;
m2=B.xy;
r2=4;
m3=C.xy;
r3=6;

        fillcircle(m1,r1,color->(1,1,1));
        fillcircle(m2,r2,color->(1,1,1));
        fillcircle(m3,r3,color->(1,1,1));
        fillcircle(m1,r1-.1,color->(.4,.1,0));
        fillcircle(m2,r2-.1,color->(.4,.1,0));
        fillcircle(m3,r3-.1,color->(.4,.1,0));
        drawcircle(m1,r1,color->(1,1,1),size->3);
        drawcircle(m2,r2,color->(1,1,1),size->3);
        drawcircle(m3,r3,color->(1,1,1),size->3);



o1=["circ",m1,r1];
o2=["circ",m2,r2];
o3=["circ",m3,r3];

p=D.xy;
s=E-D;
s=s/|s|;



intersect(p,s,o):=(
  ll=[];
  if(o_1=="circ", (
    m=o_2;
    r=o_3;

    q=p-m;
    scal=s*q;
    dist=q*q-r^2;

    a=-scal+sqrt(scal^2-dist);
    b=-scal-sqrt(scal^2-dist);



    if(|im(a)|<0.00000001 & re(a)>0.00000001,ll=ll++[[o,re(a)]]);
    if(|im(b)|<0.00000001 & re(b)>0.00000001,ll=ll++[[o,re(b)]]);
  );
  ll;
  )
);

reflect(p,s,o,a):=(
  pp=p+a*s;
  ss=s;
  if(o_1=="circ", (
       sp=pp-o_2;
       sp=sp/|sp|;
       ss=s-2*(s*sp)*sp;
    );
  );
  [pp,ss];
);

stop=false;
count=0;
n=300;
alpha=1;
dim=0.99;



while(count<n & !stop,
  count=count+1;
  l=intersect(p,s,o1)++intersect(p,s,o2)++intersect(p,s,o3);

  l=sort(l,#_2);

  if(length(l)>0,(
     hit=l_1;
     erg=reflect(p,s,hit_1,hit_2);
  //   draw(erg_1);
     draw(p,erg_1,color->(1,1,.7),alpha->alpha,size->2);
   //  draw(erg_1,erg_1+erg_2*.1,color->(1,0,0),size->2);
     p=re(erg_1);
     s=re(erg_2);
    ),(
     draw(p,p+100*s,color->(1,1,.7),alpha->alpha,size->2);
     stop=true;
    )
  );
  alpha=alpha*dim;
);



        </script>


        <div  id="CSCanvas" style="width:700px; height:700px; border:2px solid #000000"></div>

        <script type="text/javascript">

            var gslp=[

                      {name:"A", type:"Free", pos:[-3,2],color:[0,0,0]},
                      {name:"B", type:"Free", pos:[8,-3],color:[0,0,0]},
                      {name:"C", type:"Free", pos:[8.5,8],color:[0,0,0]},
                      {name:"D", type:"Free", pos:[-5,13],color:[1,0,0],size:4},
                      {name:"E", type:"Free",  pos:[-3.8,12],color:[1,1,0],size:3},

                      {name:"c1", type:"CircleMFixedr", args:["A"],radius:6,color:[0,0,0],size:0.2},
                      {name:"c2", type:"CircleMFixedr", args:["B"],radius:4,color:[0,0,0],size:0.2},
                      {name:"c3", type:"CircleMFixedr", args:["C"],radius:6,color:[0,0,0],size:0.2}


                      ];
            CindyJS({canvasname:"CSCanvas",
                        movescript:"csmove",
                        initscript:"init",
                        geometry:gslp});

        </script>

	</body>
</html>
